<template>
  <div class="movie_body" ref="movie_body">
    <Loading v-if="isLoading" />
    <Scroll v-else :pulldown="true" @pulldown="loadData">
      <ul>
        <!-- <li>
          <div class="pic_show"><img src="/images/movie_1.jpg"></div>
          <div class="info_list">
            <h2>无名之辈</h2>
            <p>观众评 <span class="grade">9.2</span></p>
            <p>主演: 陈建斌,任素汐,潘斌龙</p>
            <p>今天55家影院放映607场</p>
          </div>
          <div class="btn_mall">
            购票
          </div>
        </li> -->
        <!-- <li class="pullDown">{{ pullDownMsg }}</li> -->
        <li v-for="movie in movieList" :key="movie.id">
          <div class="pic_show" @tap="showOutDetail(movie.id)"><img :src="movie.img | setWH('128.180')"></div>
          <div class="info_list">
            <h2 @tap="showOutDetail(movie.id)">{{movie.nm}} <img v-if="movie.version" src="@/assets/images/maxs.png" /></h2>
            <p>观众评 <span class="grade">{{ movie.sc }}</span></p>
            <p>主演: {{ movie.star}}</p>
            <p>{{ movie.showInfo }}</p>
          </div>
          <div class="btn_mall">
            购票
          </div>
        </li>
      </ul>
    </Scroll>
  </div>
</template>

<script>
  import { getNowPlaying } from '@/api/api'

  export default {
    name: 'nowplaying',
    data() {
      return {
        movieList: [],
        isLoading: true,
        preCityId: -1
        // pullDownMsg: ''
      }
    },
    mounted() {
      let cityId = this.$store.state.city.id
      if(this.prevCityId === cityId) return

      this.loadData()
    },
    methods: {
      loadData() {
        this.isLoading = true
        let cityId = this.$store.state.city.id
        getNowPlaying(null, { cityId: 8 }).then(res => {
          let resData = res.data
          this.isLoading = false
          if (resData.msg === 'ok') {
            this.movieList = resData.data.movieList
            this.prevCityId = cityId
          }
        })
      },
      showOutDetail(id) { // 跳转到详情页
        //console.log('better-scroll的tap事件')
        this.$router.push('/movie/detail/1/'+id)
      }
    }
  }
</script>

<style lang="scss" scoped>

</style>
